﻿<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />
    <meta http-equiv="Content-type" content="text/html; charset=utf-8"/>

    <title>Cordova WP7</title>

	  <link rel="stylesheet" href="master.css" type="text/css" media="screen" title="no title" charset="utf-8"/>


      <script type="text/javascript" charset="utf-8" src="cordova-1.7.0.js"></script>

      <script type="text/javascript">


        document.addEventListener("deviceready",onDeviceReady,false);
        document.addEventListener("backbutton",onBackButton,false);

        // once the device ready event fires, you can safely do your thing! -jm
        function onDeviceReady()
        {
        // IE does NOT provide an alert method, you can patch it with this line after deviceready.
        window.alert = window.alert || navigator.notification.alert;

        console.log("onDeviceReady. You should see this message in Visual Studio's output window.");
        updateDeviceInfo();

        }

        function onBackButton()
        {
        console.log("onBackButton");
        }

        function updateDeviceInfo()
        {
        document.getElementById("platform").innerHTML = device.platform;
        document.getElementById("version").innerHTML = device.version;
        document.getElementById("uuid").innerHTML = device.uuid;
        document.getElementById("name").innerHTML = device.name;
        document.getElementById("width").innerHTML = screen.width;
        document.getElementById("height").innerHTML = screen.height;
        document.getElementById("colorDepth").innerHTML = screen.colorDepth;
        };

      </script>




  </head>
  <body>
    <h1>Cordova Tests</h1>
    <div id="info">
      <h4>
        Platform: <span id="platform"> </span>
      </h4>
      <h4>
        Version: <span id="version"></span>
      </h4>
      <h4>
        UUID: <span id="uuid"> </span>
      </h4>
      <h4>
        Name: <span id="name"></span>
      </h4>
      <h4>
        Width: <span id="width"></span>,   Height: <span id="height">
          
        </span>, Color Depth: <span id="colorDepth"></span>
      </h4>
    </div>

    <a href="accelerometer.html" class="btn large">Accelerometer</a>
    <a href="accelerometer2.html" class="btn large">Accel Game</a>
    <a href="audio.html" class="btn large">Audio Play/Record</a>
    <a href="camera.html" class="btn large">Camera</a>
    <a href="capture.html" class="btn large">Capture</a>
    <a href="compass.html" class="btn large">Compass</a>
    <a href="network.html" class="btn large">Connection</a>
    <a href="contacts.html" class="btn large">Contacts</a>
    <a href="events.html" class="btn large">Events</a>
    <a href="file.html" class="btn large">File</a>
    <a href="location.html" class="btn large">Location</a>
    <a href="notification.html" class="btn large">Notification</a>
    <a href="storage.html" class="btn large">Local Storage</a>
    <a href="calculator.html" class="btn large">Calculator (custom plugin)</a>
  </body>
</html>
